<?php if (!defined('THINK_PATH')) exit(); /*a:3:{s:66:"/home/wwwroot/www.xgw0851.com/application/index/view/game/dzp.html";i:1528897670;s:69:"/home/wwwroot/www.xgw0851.com/application/index/view/public/base.html";i:1530280572;s:68:"/home/wwwroot/www.xgw0851.com/application/index/view/public/nav.html";i:1488433926;}*/ ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title><?php echo $title; ?></title>
<link rel="stylesheet" href="__PUBLIC__/xsd/css/mui.min.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/xsd/css/icons-extra.css" />
<link rel="stylesheet" type="text/css" href="__PUBLIC__/xsd/css/app.css?v1111121" />

</head>
<!--/head-->
<body>


	<!--/header-->

<style>

.info-box .headimg img{

  font-size: 1.8rem;
  line-height: 1.8rem;
  width: 2.5rem;
  border-radius: 50%;
  height: 2.5rem;
  background: #fff;
  display: inline-block;
  vertical-align: middle;

}
.info-box {

    line-height: 30px;

}

</style>
<header class="mui-bar mui-bar-nav" style="z-index:7">
    <h1 class="mui-title">大转盘抽奖</h1>
</header>
<div class="mui-content " style="background: rgb(230, 45, 45);     padding-bottom: 50px;">
  <img src="__PUBLIC__/game/dzp/1.png" id="shan-img" style="display:none;">
	<img src="__PUBLIC__/game/dzp/2.png" id="sorry-img" style="display:none;">
	<div class="banner">
		<div class="turnplate" style="background-image:url(__PUBLIC__/game/dzp/turnplate-bg.png);background-size:100% 100%;">
			<canvas class="item" id="wheelcanvas" width="422px" height="422px"></canvas>
			<img class="pointer" src="__PUBLIC__/game/dzp/turnplate-pointer.png">
		</div>
	</div>
  <div class="mui-card">
      <div class="mui-card-header ">
          <div class="mui-ellipsis mui-col-xs-8">说明</div>
      </div>
      <ul class="mui-table-view mui-table-view-striped mui-table-view-condensed">
            <li class="mui-table-view-cell">
                <div class="mui-table" style="font-size:12px;">
                    <div class="mui-table-cell mui-col-xs-12">
                        <?php echo config('cjsm'); ?><br>
                        你今天还有<span id="cjjh" style="color:red;"><?php echo $degree; ?></span>抽奖机会<br />
                        奖品说明：（积分会自动加入个人账户中，奖品需联系微信）<br />
                        一等奖：
                        <?php echo getDzpinfo('ydjlx', 'ydjjp'); ?>
                        <br />
                        二等奖：
                        <?php echo getDzpinfo('edjlx', 'edjjp'); ?>
                        <br />
                        三等奖：
                        <?php echo getDzpinfo('sdjlx', 'sdjjp'); ?>
                        <br />
                        四等奖：
                        <?php echo getDzpinfo('sidjlx', 'sidjjp'); ?>
                        <br />
                        五等奖：
                          <?php echo getDzpinfo('wdjlx', 'wdjjp'); ?>


                <button type="button" class="mui-btn mui-btn-primary sbt" onclick=window.location.href="<?php echo url('index/game/history'); ?>" style="width:100%;margin-top:20px;">查看获奖记录</button>

                    </div>
                </div>
            </li>
      </ul>
  </div>
    <nav class="mui-bar mui-bar-tab">
      <a class="mui-tab-item2  <?php if($request->path() == '/'): ?> mui-active<?php endif; ?>" href="/" onclick='window.location.href = "/"'>
        <span class="mui-icon mui-icon-home"></span>
        <span class="mui-tab-label">首页</span>
      </a>
      <a class="mui-tab-item2 <?php if($request->path() == 'index/order/index'): ?> mui-active<?php endif; ?>" href="<?php echo url('index/order/index'); ?>" onclick='window.location.href = "<?php echo url('index/order/index'); ?>"'>
        <span class="mui-icon mui-icon mui-icon-list"></span>
        <span class="mui-tab-label">订单</span>
      </a>
      <a class="mui-tab-item2 <?php if($request->path() == 'index/user/index'): ?> mui-active<?php endif; ?>" href="<?php echo url('index/user/index'); ?>" onclick='window.location.href = "<?php echo url('index/user/index'); ?>"'>
        <span class="mui-icon mui-icon-contact"></span>
        <span class="mui-tab-label">我的</span>
      </a>
 </nav>
<style>
.mui-bar-tab .mui-tab-item2 {
    display: table-cell;
    overflow: hidden;
    width: 1%;
    height: 50px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #929292
}

.mui-bar-tab .mui-tab-item2.mui-active {
    color: #007aff
}

.mui-bar-tab .mui-tab-item2 .mui-icon {
    top: 3px;
    width: 24px;
    height: 24px;
    padding-top: 0;
    padding-bottom: 0
}

.mui-bar-tab .mui-tab-item2 .mui-icon~.mui-tab-label {
    font-size: 11px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis
}

.mui-bar-tab .mui-tab-item2 .mui-icon:active {
    background: 0 0
}
</style>

</div>



<!--/#footer-->

<script src="__PUBLIC__/js/jquery.js"></script>
<script src="__PUBLIC__/xsd/js/mui.min.js"></script>
<script src="__PUBLIC__/xsd/js/flexible.js"></script>
<script src="__PUBLIC__/xsd/js/template.js"></script>

<link href="__PUBLIC__/game/dzp/style.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="__PUBLIC__/game/dzp/awardRotate.js"></script>
<script type="text/javascript">
  var turnplate = {
    restaraunts: [], //大转盘奖品名称
    colors: [], //大转盘奖品区块对应背景颜色
    outsideRadius: 192, //大转盘外圆的半径
    textRadius: 155, //大转盘奖品位置距离圆心的距离
    insideRadius: 68, //大转盘内圆的半径
    startAngle: 0, //开始角度

    bRotate: false //false:停止;ture:旋转
  };

  $(document).ready(function() {
    //动态添加大转盘的奖品与奖品区域背景颜色
    turnplate.restaraunts = ["一等奖", "谢谢参与", "二等奖", "谢谢参与", "三等奖", "谢谢参与", "四等奖 ", "谢谢参与", "五等奖", "谢谢参与"];
    turnplate.colors = ["#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF"];


    var rotateTimeOut = function() {
      $('#wheelcanvas').rotate({
        angle: 0,
        animateTo: 2160,
        duration: 8000,
        callback: function() {
          alert('网络超时，请检查您的网络设置！');
        }
      });
    };

    //旋转转盘 item:奖品位置; txt：提示语;
    var rotateFn = function(item, txt) {
      var angles = item * (360 / turnplate.restaraunts.length) - (360 / (turnplate.restaraunts.length * 2));
      if (angles < 270) {
        angles = 270 - angles;
      } else {
        angles = 360 - angles + 270;
      }
      $('#wheelcanvas').stopRotate();
      $('#wheelcanvas').rotate({
        angle: 0,
        animateTo: angles + 1800,
        duration: 8000,
        callback: function() {


          mui.alert(txt);
          turnplate.bRotate = !turnplate.bRotate;
          $('#cjjh').text(0)
        }
      });
    };
    mui('body').on('tap','a',function(){
          window.top.location.href=this.href;
      });
    $('.pointer').click(function() {

      //注册
      // $userm = "<?php echo \think\Session::get('user.name'); ?>";
      // if(!$userm){
      //   mui.alert('  <a href="<?php echo url('user/info'); ?>" class="mui-btn mui-btn-primary" style="width:100%;margin-top:20px;">请先注册会员！</a>');
      //   return;
      // }


      //是否关注公众号
      // var subscribe = '<?php echo $subscribe; ?>';
      // if(subscribe != 1){
      //   $.get("<?php echo url('index/getSubscribe'); ?>", function(data){
      //     if(data.value == 0){
      //       mui.alert('<img src="/public/images/qrcode_for_wx.jpg" style="width:100%;"><p style=" text-align: left;"><b>无法识别二维码</b><br />1、打开微信，点击‘添加朋友’<br />2、点击公众号<br />3、搜索公众号：贵阳鲜果屋<br />4、点击‘关注’，完成</p>', '请长按扫二维码关注公众号');
      //       return ;
      //     }
      //   })
      //
      // }else{
      //
      //     }


        //判断抽奖次数
        if($('#cjjh').text()!=1){
          mui.alert('您今天的抽奖次数已经用完，请明天再来！');
          return;
        }


              if (turnplate.bRotate) return;
              turnplate.bRotate = !turnplate.bRotate;
              //获取随机数(奖品个数范围内) 5 100 6
              var item = rnd(1, turnplate.restaraunts.length);
              // var sjs = rnd(1, 111);
              //
              // var ydjsl = "<?php echo config('ydjsl'); ?>",edjsl = "<?php echo config('edjsl'); ?>",sdjsl = "<?php echo config('sdjsl'); ?>",sidjsl = "<?php echo config('sidjsl'); ?>",wdjsl = "<?php echo config('wdjsl'); ?>"
              //
              // console.log(parseInt(ydjsl)+parseInt(edjsl));
              // if(sjs<=ydjsl){
              //   item = 1
              // }else if (sjs>5&&sjs<=105) {
              //   item = 3
              // }else if (sjs>105&&sjs<=111) {
              //   item = 5
              // }

               $.getJSON("<?php echo url('index/game/rnd'); ?>", function(json, textStatus) {
                var item = 10;
                if(json==1){
                  item = 1;
                }else if (json==2) {
                  item = 3;
               }else if (json==3) {
                  item = 5;
              }else if (json==4) {
                   item = 7;
                }else if (json==5) {
                    item = 9;
                }
                rotateFn(item, turnplate.restaraunts[item - 1]);
               });




              // $.getJSON("<?php echo url('index/game/addCoupon'); ?>", {total: '50', price: '10'}, function(json, textStatus) {
              //
              // });

              //奖品数量等于10,指针落在对应奖品区域的中心角度[252, 216, 180, 144, 108, 72, 36, 360, 324, 288]






    });
  });

  function rnd(n, m) {
    var random = Math.floor(Math.random() * (m - n + 1) + n);
    return random;

  }


  //页面所有元素加载完毕后执行drawRouletteWheel()方法对转盘进行渲染
  window.onload = function() {
    drawRouletteWheel();
  };

  function drawRouletteWheel() {
    var canvas = document.getElementById("wheelcanvas");
    if (canvas.getContext) {
      //根据奖品个数计算圆周角度
      var arc = Math.PI / (turnplate.restaraunts.length / 2);
      var ctx = canvas.getContext("2d");
      //在给定矩形内清空一个矩形
      ctx.clearRect(0, 0, 422, 422);
      //strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式
      ctx.strokeStyle = "#FFBE04";
      //font 属性设置或返回画布上文本内容的当前字体属性
      ctx.font = '16px Microsoft YaHei';
      for (var i = 0; i < turnplate.restaraunts.length; i++) {
        var angle = turnplate.startAngle + i * arc;
        ctx.fillStyle = turnplate.colors[i];
        ctx.beginPath();
        //arc(x,y,r,起始角,结束角,绘制方向) 方法创建弧/曲线（用于创建圆或部分圆）
        ctx.arc(211, 211, turnplate.outsideRadius, angle, angle + arc, false);
        ctx.arc(211, 211, turnplate.insideRadius, angle + arc, angle, true);
        ctx.stroke();
        ctx.fill();
        //锁画布(为了保存之前的画布状态)
        ctx.save();

        //----绘制奖品开始----
        ctx.fillStyle = "#E5302F";
        var text = turnplate.restaraunts[i];
        var line_height = 17;
        //translate方法重新映射画布上的 (0,0) 位置
        ctx.translate(211 + Math.cos(angle + arc / 2) * turnplate.textRadius, 211 + Math.sin(angle + arc / 2) * turnplate.textRadius);

        //rotate方法旋转当前的绘图
        ctx.rotate(angle + arc / 2 + Math.PI / 2);

        /** 下面代码根据奖品类型、奖品名称长度渲染不同效果，如字体、颜色、图片效果。(具体根据实际情况改变) **/
        if (text.indexOf("M") > 0) { //流量包
          var texts = text.split("M");
          for (var j = 0; j < texts.length; j++) {
            ctx.font = j == 0 ? 'bold 20px Microsoft YaHei' : '16px Microsoft YaHei';
            if (j == 0) {
              ctx.fillText(texts[j] + "M", -ctx.measureText(texts[j] + "M").width / 2, j * line_height);
            } else {
              ctx.fillText(texts[j], -ctx.measureText(texts[j]).width / 2, j * line_height);
            }
          }
        } else if (text.indexOf("M") == -1 && text.length > 6) { //奖品名称长度超过一定范围
          text = text.substring(0, 6) + "||" + text.substring(6);
          var texts = text.split("||");
          for (var j = 0; j < texts.length; j++) {
            ctx.fillText(texts[j], -ctx.measureText(texts[j]).width / 2, j * line_height);
          }
        } else {
          //在画布上绘制填色的文本。文本的默认颜色是黑色
          //measureText()方法返回包含一个对象，该对象包含以像素计的指定字体宽度
          ctx.fillText(text, -ctx.measureText(text).width / 2, 0);
        }

        //添加对应图标
        if (text.indexOf("闪币") > 0) {
          var img = document.getElementById("shan-img");
          img.onload = function() {
            ctx.drawImage(img, -15, 10);
          };
          ctx.drawImage(img, -15, 10);
        } else if (text.indexOf("谢谢参与") >= 0) {
          var img = document.getElementById("sorry-img");
          img.onload = function() {
            ctx.drawImage(img, -15, 10);
          };
          ctx.drawImage(img, -15, 10);
        }
        //把当前画布返回（调整）到上一个save()状态之前
        ctx.restore();
        //----绘制奖品结束----
      }
    }
  }
</script>

<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" charset="utf-8"></script>
<script>
    wx.config(<?php echo json_encode($options); ?>);
    wx.error(function(e){
      	console.log(e);
      });
    wx.ready(function(){
      wx.onMenuShareTimeline({
          title: "鲜果屋新年感恩回馈",
          link: "<?php echo $crurl; ?>",
          imgUrl: "http://www.xgw0851.com/public/xsd/img/dzp.png",
      });
      wx.onMenuShareAppMessage({
          title: "鲜果屋新年感恩回馈",
          desc: '', // 分享描述
          link: "<?php echo $crurl; ?>",
          imgUrl: "http://www.xgw0851.com/public/xsd/img/dzp.png",

      });
    });
</script>

<?php if(!(empty(config('shop_hours')) || (config('shop_hours') instanceof \think\Collection && config('shop_hours')->isEmpty()))): ?>
<script>
  var time_range = function (beginTime, endTime) {
    var strb = beginTime.split (":");
    if (strb.length != 2) {
      return false;
    }

    var stre = endTime.split (":");
    if (stre.length != 2) {
      return false;
    }

    var b = new Date ();
    var e = new Date ();
    var n = new Date ();

    b.setHours (strb[0]);
    b.setMinutes (strb[1]);
    e.setHours (stre[0]);
    e.setMinutes (stre[1]);

    if (n.getTime () - b.getTime () > 0 && n.getTime () - e.getTime () < 0) {
      return true;
    } else {

      mui.alert("<?php echo config('shop_hours_message'); ?>", '公告');
      $('.mui-popup-buttons').html(' ')
      $('.mui-popup-inner').css('border-radius', '13px')
      return false;
    }
  }

  var shop_hours = "<?php echo config('shop_hours'); ?>";
  var hours_arr = shop_hours.split('-');
  time_range (hours_arr[0], hours_arr[1]);

</script>
<?php endif; if(config('is_rest') == '1'): ?>
<script>
mui.alert("<?php echo config('rest_message'); ?>", '公告');
$('.mui-popup-buttons').html(' ')
$('.mui-popup-inner').css('border-radius', '13px')
</script>
<?php endif; if(empty(\think\Cookie::get('positioninit')) || (\think\Cookie::get('positioninit') instanceof \think\Collection && \think\Cookie::get('positioninit')->isEmpty())): ?>
<script type="text/javascript" src="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js"></script>
<script>
   var geolocation = new qq.maps.Geolocation("QQ6BZ-24HC6-ZAXSZ-MTZAU-5MU2J-HEFEH", "鲜果屋");
    geolocation.getIpLocation(showPosition, showErr)
    function showPosition(position) {
      $.getJSON("<?php echo url('index/cart/changecookie'); ?>", {name: 'positioninit', 'val': position.lat+','+position.lng}, function(json, textStatus) {});
    };
    function showErr() {
      console.log('定位失败');
    };
</script>
<?php endif; ?>


<script>
  $(function(){
    $('.subsc').click(function(){
      // $.get("<?php echo url('index/clearusersession'); ?>", function(data){
      //   if(data.code == 1){
      //     window.location.href = "http://mp.weixin.qq.com/s/-AzpDTU7eAD24-R5QUP0wg"
      //   }
      // })
      //cookie('goodsmodel_id', $model_id);
      <?php switch(cookie('goodsmodel_id')): case "1":case "2":case "3": ?>
            mui.alert("<img src=<?php echo get_cover(config('frankserviceimg'), 'path'); ?> style='width:100%;'>", '长按扫二维码');
        <?php break; endswitch; if(!(empty($contact_qc) || ($contact_qc instanceof \think\Collection && $contact_qc->isEmpty()))): ?>
            mui.alert('<img src="<?php echo $contact_qc; ?>" style="width:100%;">', '长按扫二维码');
      <?php endif; ?>
    })


    $('.endlimit').each(function(){
      var $this = $(this);
      var stime = $this.attr('data-endtime');
      var starttime = new Date(stime.replace(/-/g,"/"))
      setInterval(function () {
        var nowtime = new Date();
        var time = starttime - nowtime;
        if(time > 0){
          var day = parseInt(time / 1000 / 60 / 60 / 24);
          var hour = parseInt(time / 1000 / 60 / 60 % 24);
          var minute = parseInt(time / 1000 / 60 % 60);
          var seconds = parseInt(time / 1000 % 60);
          $this.html("距结束还有:<span style='color:red'>"+ day + "天" + hour + "小时" + minute + "分钟" + seconds + "秒</span>");
        }

      }, 1000);
    })

    $('.hidecartbtn').each(function(){
      var id = $(this).attr('data-id')
      $('.cartbtn'+id).hide();
    })


  })
</script>
</body>
</html>
